<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>优视雅</title>
		<meta content="优视雅" name="author">
		<meta content="优视雅" name="Copyright">
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<meta content="优视雅" name="description">
		<meta content="优视雅" name="keywords">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<link rel="stylesheet" type="text/css" href="css/public.css">
		<link rel="stylesheet" type="text/css" href="css/style.css">
		<link rel="stylesheet" type="text/css" href="css/responsive.css">
		<link rel="shortcut icon" href="images/favorite.ico">
		<script src="js/jquery-1.9.1.min.js"></script>
		<script src="js/public.js"></script>
		<script src="layer/layer.js"></script>
	</head>

	<body>
		<div class="header">
			<div class="top-nav">
				<div class="j-top-nav main">
					<div class="r">
						<a href="login.html">登录</a> /
						<a href="register.html">注册</a> /
						<a href="order.html">我的订单</a> /
					</div>
				</div>
			</div>
			
		</div>

		<div class="warp">
			<div class="center main">
				<!--左边导航菜单-->
				<div class="left_style">
					<a href="user.html" class="user_title">用户中心</a>
					<p><img src="images/touxiang.png" class="touxiang" /></p>
					<p><span class="name">东方不败</span>
						<a href="edit_passd.html">[修改密码]</a>
					</p>
					<ul class="meun">
						<li>
							<a href="javascript:;" class="link"><s>+</s>订单管理</a>
							<ul class="sub">
								<li>
									<a href="order.html">我的订单</a>
								</li>
								<li>
									<a href="address.html">收货地址</a>
								</li>
							</ul>
						</li>
						<li>
							<a href="javascript:;" class="link"><s>+</s>会员管理</a>
							<ul class="sub">
								<li>
									<a href="user_info.html">用户信息</a>
								</li>
								<!--<li><a href="shouchang.html">我的收藏</a></li>-->
								<li>
									<a href="pinglun.html">我评论</a>
								</li>
								<li>
									<a href="my_team.html">我的团队</a>
								</li>
								<li>
									<a href="my_card.html">支付宝</a>
								</li>
								<li>
									<a href="my_cord.html">我的推广码</a>
								</li>
							</ul>
						</li>
						<li>
							<a href="javascript:;" class="link"><s>+</s>账户管理</a>
							<ul class="sub">
								<li>
									<a href="shouyi_record.html">收益记录</a>
								</li>
								<li>
									<a href="consume_record.html">消费记录</a>
								</li>
								<li>
									<a href="chongzhi.html">我的充值</a>
								</li>
								<li>
									<a href="tixian.html">我的提现</a>
								</li>
								<li>
									<a href="tixian_record.html">提现记录</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>

				<div class="right_style">
					<h3 class="title_style"><em></em><span>收货地址</span></h3>
					<div id="address">
						<!--用户地址-->
						<div class="address_content">
							<div class="address_prompt">最多保存添加5条地址
								<a href="javascript:;" class="add">添加收货地址</a>
							</div>
							<table cellpadding="0" cellspacing="0" class="user_address" width="100%">
								<thead>
									<tr class="label">
										<td style="width:10% ;">收货人</td>
										<td style="width:20% ;">所在地</td>
										<td style="width:30% ;">详细地址</td>
										<td style="width:10% ;">邮编</td>
										<td style="width:20% ;">电话手机</td>
										<td style="width:10% ;">操作</td>
									</tr>
								</thead>
								<tbody>
									<tr class="label-list">
										<td>张小泉</td>
										<td>江苏南京雨花台区</td>
										<td>大件路4号软件大厦B栋102室</td>
										<td>210000</td>
										<td>12343323221</td>
										<td>
											<a href="javascript:;" class="edit">修改</a> |
											<a href="javascript:;" class="delet">删除</a>
										</td>
									</tr>
									<tr class="label-list">
										<td>李白</td>
										<td>江苏南京雨花台区</td>
										<td>大件路4号软件大厦B栋102室</td>
										<td>210000</td>
										<td>12343323221</td>
										<td>
											<a href="javascript:;" class="edit">修改</a> |
											<a href="javascript:;" class="delet">删除</a>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<ul class="add-ul app_address">
						<li>
							<p style="">收货人:<span>东方不败</span> <span>13516984569</span>
								<a href="javascript:;" class="edit"><img src="images/ico_edit.png" class="edit" style=""></a>
							</p>
							<p>
								<a href="">广东省深圳市明治大道</a>
							</p>
							<a class="det"><img src="images/det01.png"></a>
						</li>
						<li>
							<p style="">收货人:<span>东方不败</span> <span>13516984569</span>
								<a href="javascript:;" class="edit"><img src="images/ico_edit.png" class="edit" style=""></a>
							</p>
							<p>
								<a href="">广东省深圳市明治大道</a>
							</p>
							<a class="det"><img src="images/det01.png"></a>
						</li>
					</ul>
					<!--没有记录时显示-->
					<div class="no_record" style="display:none;width: 200px;text-align: center;margin: 0 auto;margin-top: 100px;">
						<img src="images/kong.png" style="width: 100px;" />
						<p style="text-align: center;color: #555;font-size: 14px;">暂无地址，请添加地址</p>
					</div>
				</div>
			</div>
		</div>
		<style>
			.layui-layer-shade{height: auto;}
		</style>

		<script>
			var w = $(document).width();
			//console.log(w)
			//添加地址
			$('.add').on('click', function() {
				layer.open({
					type: 1,
					title: '添加地址',
					maxmin: true,
					shadeClose: true, //点击遮罩关闭层
					area: [w * 0.9 + "px", '450px'],
					//					style:"width:100%;height:550px",
					content: $('#add_address')
				});
			});
			//修改地址
			$('.edit').click(function() {
			var index =	layer.open({
					type: 1,
					title: '修改地址',
					maxmin: true,
					//shadeClose: true, //点击遮罩关闭层
					area: [w * 0.9 + "px", '450px'],
					content: $('#edit_address'),
					style:"z-index:0;background:#fff;",
					function(){
						layer.close(index);
					}
				});

			});

			//PC端没有地址时的显示问题
			if($("#address table").css("display") == "block") {
				if($(".label-list").length <= 0) {
					$(".no_record").show();
				} else {
					$(".no_record").hide();
				}
			}

			//移动端端没有地址时的显示问题
			if($(".app_address").css("display") == "block") {
				//alert(1)
				if($(".label-list").length <= 0) {
					$(".no_record").show();
				} else {
					$(".no_record").hide();
				}
			}
		</script>

	<!--添加送货地址弹窗-->
		<div class="add_address" id="add_address" style="display: none;">
			<div class="">
				<span class="name">添加送货地址</span>
				<form>
					<table cellpadding="0" cellspacing="0" width="100%">
						<tr>
							<td class="label_name">收&nbsp;货&nbsp;&nbsp;人：</td>
							<td><input name="user" type="text" class="add_text" style=" width:100px" /><i>*</i></td>
						</tr>
						<tr>
							<td class="label_name">手&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;机：</td>
							<td><input name="tel" type="text" class="add_text" style=" width:200px" /></td>
						</tr>
						<tr>
							<td colspan="3">
								<select name="province"></select><select name="city"></select><select name="area"></select>
							</td>
						</tr>
						<tr>
							<td class="label_name">详细地址：</td>
							<td><textarea name="address-info" cols="" rows=""></textarea><i>*</i></td>
						</tr>
						<tr>
							<td class="label_name">邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;编：</td>
							<td><input name="youbian" type="text" class="add_text" style=" width:100px" /><i>*</i></td>
						</tr>
						<tr class="moren_dz" style="color: #999">
							<td class="label_name"></td>
							<td><label><input name="" type="checkbox" value="" />设置为默认地址</label></td>
						</tr>
						<tr>
							<td colspan="2" class="center"><input name="" type="button" value="保存" class="add_dzbtn" /><input name="" type="reset" value="清空" class="reset_btn" /></td>
						</tr>
					</table>
				</form>
			</div>
		</div>
		
		<!--修改地址弹窗-->
		<div class="add_address" id="edit_address" style="display: none;">
			<div class="">
				<span class="name">修改送货地址</span>
				<form>
					<table cellpadding="0" cellspacing="0" width="100%">
						<tr>
							<td class="label_name">收&nbsp;货&nbsp;&nbsp;人：</td>
							<td><input name="user" type="text" class="add_text" style=" width:100px" /><i>*</i></td>
						</tr>
						<tr>
							<td class="label_name">手&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;机：</td>
							<td><input name="tel" type="text" class="add_text" style=" width:200px" /></td>
						</tr>
						<tr>
							<td colspan="3">
								<select name="province1"></select><select name="city1"></select><select name="area1"></select>
							</td>
						</tr>
						<tr>
							<td class="label_name">详细地址：</td>
							<td><textarea name="address-info" cols="" rows=""></textarea><i>*</i></td>
						</tr>
						<tr>
							<td class="label_name">邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;编：</td>
							<td><input name="youbian" type="text" class="add_text" style=" width:100px" /><i>*</i></td>
						</tr>
						<tr class="moren_dz" style="color: #999">
							<td class="label_name"></td>
							<td><label><input name="" type="checkbox" value="" />设置为默认地址</label></td>
						</tr>
						<tr>
							<td colspan="2" class="center"><input name="" type="button" value="保存" class="add_dzbtn" /><input name="" type="reset" value="清空" class="reset_btn" /></td>
						</tr>
					</table>
				</form>
			</div>
		</div>
		
		<script src="js/PCASClass.js"></script>
		<script>
			new PCAS("province", "city", "area");
			new PCAS("province1", "city1", "area1");
		</script>

		<!--footer-->
		<div class="footer">
			<p><span>西雅衣家(中国)商业有限公司</span> 客服电话 <span>400 018 0960</span></p>
		</div>
		<!--回到顶部-->
		<a href="javascript:;" class="toTop"><img src="images/toTop.png"></a>
		<!--手机底部-->
		<!--占位，防止被底部遮住-->
		<div class="height1"></div>
		<div class="app_footer">
			<ul>
				<li>
					<a href="javascript:;" onclick="window.history.go(-1)">
						<div class="footer-div">
							<p><img src="images/ico_back.png"></p>
							<p>返回上一级</p>
						</div>
					</a>
				</li>
				<li>
					<a href="index.html">
						<div class="footer-div">
							<p><img src="images/ico_home.png"></p>
							<p>首页</p>
						</div>
					</a>
				</li>
				<li>
					<a href="index.html">
						<div class="footer-div">
							<p><img src="images/ico_zichanbao.png"></p>
							<p>资产包</p>
						</div>
					</a>
				</li>
				<li>
					<a href="user.html">
						<div class="footer-div">
							<p><img src="images/ico_per.png"></p>
							<p>个人中心</p>
						</div>
					</a>
				</li>
				
			</ul>
		</div>

		<script>
			$(".app_footer li").eq(3).addClass("active");
			$(".app_footer li.active img").attr("src", "images/ico_perFoot.png")
		</script>
	</body>

</html>